<fieldset class="layui-elem-field layui-field-title site-title">
    <legend><a name="fixbar">出入记录</a></legend>
</fieldset>
<a href="javascript:get();" style="padding: 0 0px"><i class="fa fa-refresh fa-lg"></i> <span>刷新</span></a>
<table class="layui-table" id="bookTable">
    <colgroup>
        <col>
    </colgroup>
    <thead>
    <tr>
<!--        dmtid: null-->
<!--        dmtname: null-->
<!--        dmtroom: null-->
<!--        inTime: "2020-09-02 15:33:15"-->
<!--        outTime: "2020-09-02 15:33:15"-->
<!--        userID: "20156393"-->
<!--        username: null-->
        <th>宿舍号</th>
        <th>宿舍名称</th>
        <th>宿舍房间</th>
        <th>进入时间</th>
        <th>出去时间</th>
        <th>用户编号</th>
        <th>用户名</th>
    </tr>
    </thead>
    <tbody id="inOutTableBody">
    <!--    <tr>-->
    <!--      <td>1</td>-->
    <!--      <td>2016-11-29</td>-->
    <!--      <td>人生就像是一场修行</td>-->
    <!--    </tr>-->

    </tbody>
</table>
<div id="bookTableBody2"></div>
<script>
    var gcount;
    var gdatas;
    var glimit = 10;

    function pagerFunc(obj, first) {
        //obj包含了当前分页的所有参数，比如：
        //首次不执行
        // if(!first){
        //do something
        console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
        console.log(obj.limit); //得到每页显示的条数
        var start = (obj.curr - 1) * obj.limit;
        var end;
        if (start + obj.limit > gcount) {
            end = gcount;
        } else {
            end = start + obj.limit;
        }
        mprint(start, end);
    }
    <!--        dmtid: null-->
    <!--        dmtname: null-->
    <!--        dmtroom: null-->
    <!--        inTime: "2020-09-02 15:33:15"-->
    <!--        outTime: "2020-09-02 15:33:15"-->
    <!--        userID: "20156393"-->
    <!--        username: null-->
    function mprint(start, end) {
        var tbhtml = "";
        for (var i = start; i < end; i++) {
            tbhtml += "<tr><td>" + gdatas[i].dmtid +
                "</td><td>" + gdatas[i].dmtname +
                "</td><td>" + gdatas[i].dmtroom +
                "</td><td>" + gdatas[i].inTime +
                "</td><td>" + gdatas[i].outTime +
                "</td><td>" + gdatas[i].userID +
                "</td><td>" + gdatas[i].username +
                "</td></tr>";
        }
        console.log(tbhtml);
        $('#inOutTableBody').html(tbhtml);

    }

    function get() {
        $.ajax({
            //几个参数需要注意一下
            type: "GET",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "http://localhost:8080/dmt/getRecord",//url
            // data: $('#form1').serialize(),
            success: function (datas) {
                gcount = datas.length;
                gdatas = datas;
                console.log(datas);
                console.log('datas.length');//打印服务端返回的数据(调试用)
                layui.use('laypage', function () {
                    var laypage = layui.laypage;
                    //执行一个laypage实例
                    laypage.render({
                        elem: 'bookTableBody2' //注意，这里的 test1 是 ID，不用加 # 号
                        , count: gcount //数据总数，从服务端得到
                        , limit: glimit
                        , jump: pagerFunc
                        // }
                    });

                });
            },
            error: function () {
                layer.msg("异常！");
            }

        });
    };

    get();
</script>